<template>
<div class="layout">

	<Layout>

		<Sider collapsible :collapsed-width="78"
			v-model="isCollapsed" width="256" style="background:#001529;"
			><dlqmenu :isCollapsed="isCollapsed" />
		</Sider>
		<Layout >
			<Header :style="headerClass">
				<dlqheader />
			</Header>
			<Content style="padding:20px;">
				<Card :dis-hover="true">
       
					<keep-alive >
		    			<router-view v-if="$route.meta.keepAlive" ></router-view>
		    		</keep-alive>

		    		<router-view v-if="!$route.meta.keepAlive" ></router-view>

	    		</Card>
			</Content>
		</Layout>
	</Layout>

</div>
</template>

<script>

import dlqmenu from '@/components/menu/index'
import dlqheader from '@/components/header/index'

import { mapGetters } from 'vuex'


export default {
	
	name : 'index',
	
	data () {
		return {
		  	isCollapsed : false,

		  	headerClass : {
		  		background: '#fff', 
		  		boxShadow: '0 2px 3px 2px rgba(0,0,0,.1)',
		  		// color : '#fff',
		  		fontSize : '20px',
		  		paddingLeft : '20px',
		  		paddingTop : '4px',
		  	}
		}
	},

	props : {

	},

	components : {
		dlqmenu,
		dlqheader,
	},

	computed : {
		...mapGetters([
			'router',
		]),
	},

	methods : {
		
	},

	watch : {
	    
	},

	mounted () {
		this.$store.dispatch('getUserInfo');
		this.$store.dispatch('getMenuList', {
			menu_id : 'aa54d722-46ce-11e9-b3be-0242ac11001d'
		});
		// this.$store.dispatch('getRouter');
	},

}
</script>

<style scoped>
.layout{
    border: 1px solid #d7dde4;
    background: #f5f7f9;
    position: relative;
    border-radius: 4px;
    overflow: hidden;
}

.header1 {
	background: '#fff';
	box-shadow: '0 2px 3px 2px rgba(0,0,0,.1)';
}


</style>
